<template>
    <div>
        <Modal
                class="model"
                v-model="show"
                :footer-hide= "footerHide"
                @on-cancel="handleCancel(false)"
                title="编辑剩余治疗量"
                :mask-closable="false"
                width="40%">
            <Input style="width: 300px;margin-bottom: 20px" v-model="DataName" placeholder="请输入项目名称" clearable @on-clear="Detail" @on-enter="submit" />
            <Table size="small" ref="table" :columns="columns" :data="data" :loading="loading" border >
                <template slot-scope="{ row, index }" slot="action">
                    <Button type="success" @click="open(row)">新增</Button>
                    <Divider type="vertical"/>
                    <Button type="warning" @click="openRefund(row)" >退费</Button>
                </template>
            </Table>
        </Modal>

        <Modal v-model="modal13" :mask-closable="false"  :mask="true"  scrollable :title="addData.clinic_project_name+'——新增'" @on-ok="addTreatNum  " @on-cancel="ShutDown">
            <span style="margin: 0 10px">正常</span>
            <InputNumber v-model="num" :min="value" style="width: 60px" type="number" @on-change="addNUM"/>
            <span style="margin: 0 10px">现有：</span><span>{{addData.total_num}}</span>
            <span style="margin: 0 10px">援助</span>
            <InputNumber :min="value"  style="width: 60px" v-model="num2" type="number" @on-change="addHelpNum" />
            <span style="margin: 0 10px">现有：</span>
            <span>{{addData.help_num}}</span>
            <div slot="footer">
                <Button @click="handleDrawerCancel()">取消</Button>
                <Button type="primary" :loading="loadings" @click="addTreatNum()">确定</Button>
            </div>
        </Modal>
        <Modal v-model="modal14" :mask-closable="false"    scrollable :title="reduceData.clinic_project_name+'——退费'" @on-ok="RefundTreatNum" @on-cancel="ShutDown">
            <span style="margin: 0 10px">正常</span><InputNumber :disabled="disabled" v-model="num" :min="value" :max="parseInt(initial)" style="width: 60px" @on-change="reduce" /><span style="margin: 0 10px">现有：</span><span>{{reduceData.total_num}}</span>  <span style="margin: 0 10px">援助</span><InputNumber :min="value" :max="parseInt(HelpNum)" style="width: 60px" :disabled="disableds" v-model="num2" type="number" @on-change="reduceNum"/> <span style="margin: 0 10px">现有：</span><span>{{reduceData.help_num}}</span>
        </Modal>
    </div>
</template>
<script>
    import { formatWithYear, formatWithSeperator } from '@/utils/datetime';
    import { CreateReturn, GetReturnItemList } from '@api/returnVisit';
    import { GetTreatmentNum, addTreatNum, RefundTreatNum } from '@/api/patient'
    export default {
        data () {
            return {
                DataName: '',
                value1: 1,
                value2: 1,
                value: 0,
                modal13: false,
                modal14: false,
                footerHide: true,
                TimeList: '',
                loading: false,
                show: false,
                searchItem: {
                    date: [],
                    select: '00'
                },
                formItem: {
                    input: '',
                    tag: [],
                    select: '',
                    radio: '3',
                    radios: '1',
                    date: '',
                    date1: '',
                    textarea: ''
                },
                formRule: {
                    textarea: [
                        { required: true, message: '回访内容不能为空', trigger: 'blur' }
                    ],
                    date: [
                        { required: true, message: '下次回访日期不可为空' }
                    ]
                },
                postList: [{ id: '00', name: '全部岗位' }],
                taglist: [],
                columns: [
                    {
                        title: '项目名称',
                        key: 'clinic_project_name',
                        minWidth: 100
                    },
                    {
                        title: '正常数量',
                        key: 'total_num',
                        minWidth: 80
                    },
                    {
                        title: '援助数量',
                        key: 'help_num',
                        minWidth: 80
                    },
                    {
                        title: '操作',
                        minWidth: 200,
                        slot: 'action'
                    }
                ],
                itemData: {},
                itemList: [],
                tagList: [],
                typeList: [],
                methodList: [],
                dateOption: {
                    disabledDate (pick) {
                        const curDate = new Date();
                        curDate.setTime(curDate.getTime() - (3600 * 1000 * 24));
                        let reVal = 0;
                        if (pick < curDate) {
                            reVal = 1;
                        }
                        return reVal;
                    }
                },
                data: [],
                newData: [],
                num: 0,
                num2: 0,
                addData: [],
                initial: 0,
                patient_card_id: '',
                HelpNum: 0,
                reduceData: [],
                disabled: false,
                disableds: false,
                id: '',
                loadings: false
            }
        },
        methods: {
            async RefundTreatNum () {
                this.$Message.info('退费成功')
                const conifg = {
                    patient_card_id: this.itemData.patient_card_id,
                    clinic_project_id: this.reduceData.clinic_project_id,
                    total_num: this.num || 0,
                    help_num: this.num2 || 0
                }
                await RefundTreatNum(conifg).then(res => [
                ])
                this.num = 0
                this.num2 = 0
                this.getEditDetail(this.patient_card_id)
            },
            reduceNum (e) {
                this.reduceData.help_num = parseInt(this.HelpNum) - e
            },
            reduce (e) {
                this.reduceData.total_num = parseInt(this.initial) - e
            },
            ShutDown () {
                this.num = 0
                this.num2 = 0
            },
            submit () {
                GetTreatmentNum({ patient_card_id: this.id, clinic_project_name: this.DataName }).then(res => {
                    this.data = res
                })
            },
            addHelpNum (e) {
                this.addData.help_num = e + parseInt(this.HelpNum)
            },
            addNUM (e) {
                this.addData.total_num = e + parseInt(this.initial)
            },
            openRefund (row) {
                this.modal14 = true
                this.reduceData = Object.assign({}, row)
                this.initial = this.reduceData.total_num
                this.HelpNum = this.reduceData.help_num
                if (parseInt(this.reduceData.total_num) < 0) {
                    this.disabled = true
                }
                if (parseInt(this.reduceData.help_num) < 0) {
                    this.disableds = true
                }
            },
            async addTreatNum () {
                this.loadings = true
                this.$Message.info('新增成功')
                const conifg = {
                    patient_card_id: this.itemData.patient_card_id,
                    clinic_project_id: this.addData.clinic_project_id,
                    total_num: this.num || 0,
                    help_num: this.num2 || 0
                }
                await addTreatNum(conifg).then(res => { 
                    this.loadings = false
                    this.modal13 = false
                })
                this.num = 0
                this.num2 = 0
                this.getEditDetail(this.patient_card_id)
            },
            handleDrawerCancel() {
                this.modal13 = false
            },
            handleCancel (value) {
                this.show = value
            },
            open (row) {
                this.addData = Object.assign({}, row)
                this.initial = this.addData.total_num
                this.HelpNum = this.addData.help_num
                this.modal13 = true
            },
            changeText (e) {
                this.time = e
                let CurrentDate = new Date().getTime()
                let ReturnDate = e * 24 * 60 * 60 * 1000
                this.Time = ReturnDate + CurrentDate
                this.format(this.Time)
            },
            format (data) {
                var time = new Date(data);
                var y = time.getFullYear();
                var m = time.getMonth() + 1;
                var d = time.getDate();
                var h = time.getHours();
                var mm = time.getMinutes();
                var s = time.getSeconds();
                this.formItem.date = y + '-' + (m) + '-' + (d) + ' ' + (h) + ':' + (mm) + ':' + (s);
            },
            handleShow (row, types, tags) {
                this.show = true;
                this.itemData = row;
                this.typeList = types;
                this.tagList = tags;
                this.patient_card_id = row.patient_card_id
                this.getEditDetail(row.patient_card_id);
            },
            handleChangeRadio (id) {
                let obj = this.methodList.filter(item => item.id === id)
                if (obj && obj[0].name === '已到院') {
                    this.formItem.textarea = '已到院'
                } else {
                    this.formItem.textarea = ''
                }
            },
            getEditDetail (id) {
                this.id = id
                GetTreatmentNum({ patient_card_id: id }).then(res => {
                    this.data = res
                })
            },
            Detail () {
                GetTreatmentNum({ patient_card_id: this.id }).then(res => {
                    this.data = res
                })
            },
            filterId (name, types) {
                let reVal = ''
                if (types && types.length > 0) {
                    types.forEach(type => {
                        if (type.name === name) {
                            reVal = type.id;
                        }
                    })
                }
                return reVal;
            },
            handleLoad () {
                const params = {
                    patient_user_id: this.itemData.id,
                    start_time: this.searchItem.date[0] && this.formDate(this.searchItem.date[0]),
                    end_time: this.searchItem.date[1] && this.formDate(this.searchItem.date[1]),
                    profession_id: this.searchItem.select === '00' ? '' : this.searchItem.select,
                    page: 0,
                    pageSize: 0
                }
                GetReturnItemList(params).then((res) => {
                    this.itemList = res.list
                    if (this.postList.length === 1) {
                        const postList = res.condition.permission_list
                        this.postList = this.postList.concat(postList);
                    }
                }).catch(() => {})
            }
        }
    }
</script>
<style scoped>
    .time {
        font-size: 14px;
        font-weight: bold;
    }
    .content {
        padding: 10px 0;
    }
    .consultant {
        color: #9ea7b4;
    }
    .c-inr {
        margin: 0 10px;
    }
    .c-inr-right {
        margin-right: 10px;
    }
    .b-phone {
        line-height: 26px;
        font-size: 12px;
    }
    h4 span {
        margin-left: 5px;
    }
    .side-bg {
        background: #f2f2f2;
        padding: 24px !important;
        height: 570px;
        max-height: 570px;
        overflow-y: auto
    }
    .return-form {
        padding: 24px;
    }
    .title {
        font-weight: bold;
        font-size: 16px;
        padding: 24px 0 0 24px;
    }
    .sky-screen {
        margin-top: 16px;
    }
    .model .ivu-modal-body {
        padding: 0px;
    }
</style>
